body{
  padding-bottom:60px;
}

.add_to_car{
  position:absolute;
  width:30px;
  height:30px;
  top:5px;
  right:10px;
  background: url("../img/web_icon.png") no-repeat -2px -70px;
  z-index:10;
  border-radius:50%;
  background-color: #dbdbdb;
  opacity:0.5;
}

.content{
  padding-left:15px;
  p{
    padding:10px 0px 10px;
    letter-spacing:4px;
    font-size:20px;
  }
  div{
    color:#F3A3B6;
    padding-top:5px;
    letter-spacing:2px;
    s{font-size:20px;}
    u{font-size:30px;}
  }
  ul{
    margin-top:10px;
    width:100%;
    li{
      color:#A5A5A5;
      margin-right:1%;
      span{
        font-size: 9px;;
      }
    }
  }
}

.guodu{
  width:100%;
  height:10px;
  border-top:1px solid #E2E2E2;
  border-bottom:1px solid #E2E2E2;background-color: #F8F8F8;
  margin-top: 10px;
}

.detail{
  width:100%;
  .top{
    width:100%;
    ul{
      width:100%;
      padding:15px 0 ;
      border-bottom:1px solid #E0E0E0;
      //overflow: hidden;
      li{
        color:#111111;
        padding:0 20px;
        position:relative;
        span{
          font-size:14px;
          display: inline-block;
          width:60px;
          text-align: center;
        }
        i{
          display: inline-block;
          height:20px;
          border-right:1px solid #E9E9E9;
          position:absolute;
          top:1px;
          right:0px;
        }
        u{
          display: none;
          width:80px;
          border-top:1px solid #F29FB3;
          position:absolute;
          bottom:-16px;
          left:9px;
        }
      }
      li:nth-child(2){
        text-align: center;
        u{
          left:8px;
        }
      }
      li:nth-child(3){
        text-align: center;
        u{
          left:10px;
        }
      }
      li.current{
        color:#F29FB3;
        u{
          display: inline-block;
        }
      }
    }
  }
  div.pro_detail{
    //display: none;
    .img{
      margin-top:20px;
      img{
        width:100%;
        height:250px;
        margin-bottom:20px;
      }
      img:last-child{margin-bottom:-5px;}
    }
  }
  div.good_evaluate,div.advice{
    display: none;
    width:100%;
    padding:5%;
    .evaluate{
      margin-bottom:20px;
    }
    .icon{
      width:45px;
      height:45px;
      img{
        width:100%;
        height:100%;
        border-radius: 50%;
      }
    }
    .main{
      margin-left:4%;
      width:80%;
      .user_name{
        width:100%;
        overflow: hidden;
        span{
          font:10pt bold;
        }
        span.rt{
          font-size:9pt;
          color:#888888;
        }
      }
      .goal{
        span{
          display: inline-block;
          width:10px;
          height:10px;
          background-image: url("../img/dark_star.png");
        }
      }
      >p{
        font-size:9pt;
        margin-bottom:5px;
      }
      .shaitu{
        img{
          width:65px;
          height:65px;
          margin:0 5px 5px 0;
        }
        img:nth-child(3n){
          margin-right:0;
        }
      }
      .reply{
        width:100%;
        padding:10px 5px;
        background-color: #f9f9f9;
        letter-spacing: 1px;
        font-size:9pt;
      }
    }
  }
}
footer{
  width:100%;
  max-width:640px;
  height:60px;
  position:fixed;
  bottom:0px;
  background-color: #fbfbfb;
  ul{
    margin-top:20px;
    height:40px;
    li:not(:last-child){
      border-right:1px solid #bfbfbf;
    }
    li{
      height:43%;
      width:28%;
      text-align: center;
      line-height: 30px;
      a{
        font-size:12pt;
        color:#4b4b4b;
        position:relative;
        top:-6px;
      }
    }
    li:first-child{
      width:16%;
      a{
        display: inline-block;
        width:21px;
        height:20px;
        background: url("../img/web_icon.png") no-repeat -5px -4px;
        margin-top:5px;
      }
    }
    li:nth-child(3){
      border:0;
    }
    li:last-child{
      height: 60px;
      background-color: #F29FB3;
      position:relative;
      top:-20px;
      a{
        display: inline-block;
        width:100%;
        height:100%;
        color:#ffffff;
        top:0;
        text-align: center;
        line-height: 60px;
      }
    }
  }
}

#popupwindow{
  overflow: hidden;
  display: none;
  .coverBox{
    width:100%;
    height:1000px;
    position:fixed;
    top:0;
    left:0;
    z-index:10;
    background-color: #000000;
    opacity:0.4;
  }
  .main{
    width:100%;
    height:300px;
    background-color: #ffffff;
    position:fixed;
    left:0px;
    z-index:11;
    .icon{
      position:relative;
      top:-15px;
      left:15px;
      img{
        width:65px;
        height:65px;
        box-shadow: 1px 0px 5px #f29fb3;
      }
    }
    .detail{
      position:absolute;
      top:10px;
      left:90px;
      width:65%;
      h3{
        font-size:12pt;
        font-weight: normal;
      }
      div{
        i,u{color:#f29fb3;font-size:9pt;}
        u{
          font-size:10pt;
          margin-right:20px;
        }
        span{
          font-size:9pt;

        }
      }
    }
    .close{
      position:absolute;
      top:-10px;
      right:10px;
      img{
        width:20px;
      }
    }
    >p{
      font-size:14px;
      padding-left:15px;
    }
    >ul{
      margin:20px 0 20px 15px;
      overflow: hidden;
      li{
        width:65px;
        height:20px;
        text-align: center;
        line-height:18px;
        font-size:9pt;
        border:1px solid #dbdbdb;
        margin-right:10px;
        color:#888888;
      }
      li:last-child{
        margin:0;
      }
      li.selected{
        color:#f29fb3;
        border-color:#F29FB3;
      }
    }
    .counts{
      margin:15px 0 0 15px;
      img{
        width:25px;
      }
      input{
        display: inline-block;
        width:35px;
        height:25px;
        border:0;
        border-radius:0;
        -webkit-appearance: none; /*去除系统默认的样式*/
        box-shadow:none;
        border-top:1px solid #E0E0E0;
        border-bottom:1px solid #E0E0E0;
        text-align: center;
        line-height:25px;
        position:relative;
        //top:1px;
        font-size:12px;
      }
    }
    .btn{
      width:100%;
      height:60px;
      text-align: center;
      line-height: 60px;
      color:#ffffff;
      background-color: #F29FB3;
      font-size:16pt;
      position:absolute;
      bottom:0;
    }
    .error{
      width:120px;
      height:25px;
      text-align: center;
      line-height: 25px;
      position:absolute;
      top:-55px;
      left:33%;
      font-size: 14px;
      display: none;
      color:#ffffff;
      border-radius:15px;
      background-color: #000000;
    }
  }
  .animationShow{
    animation: show 500ms linear;
  }
  .animationHide{
    animation: hide 500ms linear;
  }
  @keyframes show {
    from{bottom:-320px;}to{bottom:0;}
  }
  @keyframes hide {
    from{bottom:0;}to{bottom:-320px;}
  }
}
